* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 21px;
    line-height: 1.5;
    background-color: #110310;
}

a:any-link {
    color: #8FA1FF
}

a.navlink:link {
    color: #BCA679;
    transition: 0.5s;
    font-family: "Libre Barcode 128 Text", system-ui;
}

a.navlink:hover {
    font-size: 108%;
}

a.navlink:visited {
    color: #BCA679;
    transition: 0.5s;
}

img {
    /*makes alt text readable*/
    color: white;
    pointer-events: none;
}

h1 {
    font-family: "Bai Jamjuree", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.6em;
    margin-bottom: 0.5em;
}

h2 {
    font-size: 2.18em;
    font-weight: 400;
    font-style: normal;
    font-family: "Libre Barcode 128 Text", system-ui;
}

    h2.alt {
        font-size: 2.8em;
    }


    h2.altLrg {
        font-size: 3.1em;
        color: #BCA679;
        margin-bottom: 60px;
    }

/*for barcode headers*/
h3 {
    color: #BCA679;
    font-size: 1.6em;
    font-weight: 400;
    font-style: normal;
    font-family: "Libre Barcode 128 Text", system-ui;
}

p {
    font-family: "Bai Jamjuree", sans-serif;
    font-weight: 400;
    font-style: normal;
}

#topgradient {
    height: 80px;
    background-color: #110310;
    background-image: linear-gradient(to top, rgb(0, 0, 0, 0), rgb(0, 0, 0, 0), #8FA1FF);
}

#bottomgradient {
    height: 80px;
    background-color: #110310;
    background-image: linear-gradient(to top, #8FA1FF, rgb(0, 0, 0, 0), rgb(0, 0, 0, 0));
}

.main-container {
    width: 1440px;
    margin: 0 auto;
    animation-name: open_up_horiz;
    animation-duration: 1.2s;
}

.content-strip {
    width: 1200px;
    margin: 0 auto;
    /*background-color: white;*/
}

.headline {
    width: 1200px;
    height: 1020px;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
}

.highlight {
    color: #FF2E00;
}

.highlight-alt {
    color: #8FA1FF; 
}

.navbar-container {
    width: 1200px;
    margin-bottom: 60px;
    display: flex;
    gap: 200px;
}

.navbar-container-3x1 {
    width: 1200px;
    margin-bottom: 60px;
    display: flex;
    gap: 160px;
}

.nav-content {
    width: 500px;
    height: 80px;
    /*background-color: #2ecc71;*/
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3em;
    margin: 0 auto;
}

.content-section-1x1 {
    width: 1200px;
    display: flex;
    margin-bottom: 60px;
}

.content-section-2x1 {
    width: 1200px;
    display: flex;
    gap: 80px;
    margin-bottom: 80px;
}

.content-section-3x1 {
    width: 1200px;
    display: flex;
    gap: 50px;
    margin-bottom: 80px;
}

.content-block-1x1 {
    width: 400px;
    margin: 0 auto;
    /*background-color: #2ecc71;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1em;
    color: #EFD9CE;
}

.content-block-1x1-text {
    width: 470px;
    margin: 0 auto;
    /*background-color: #2ecc71;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1em;
    color: #EFD9CE;
}

.content-block-2x1 {
    width: 400px;
    margin: 0 auto;
    /*background-color: #2ecc71;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1em;
    color: #EFD9CE;
}

.content-block-3x1 {
    width: 300px;
    margin: 0 auto;
    /*background-color: #2ecc71;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1em;
    color: #EFD9CE;
}

.content-block-3x1-text {
    width: 420px;
    margin: 0 auto;
    /*background-color: #2ecc71;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1em;
    color: #EFD9CE;
}